<template v-for="item in ImageDataListShow">
	<div 
		class="image-item" 
		:key="item.rid" 
		:data-rid="item.rid"
		:style="{top:item.ptop+'px',left:item.pleft+'px',width:item.pwidth+'px'}">
		<div class="image-inside">
			<div class="topFlex" v-if="!ImageDocumentCtrl">
				<!-- <div v-if="parseInt(item.share)" class="circulars" @click.stop="ImageOperation('share',item.rid)">
					<i class="ri-share-line"></i>
				</div> -->
				<!-- <div v-if="parseInt(item.download)" class="circulars" @click.stop="ImageOperation('down',item.dpath)">
					<i class="ri-download-2-line"></i>
				</div> -->
				<el-dropdown trigger="click" @command="ImageOperation" placement="bottom" v-if="parseInt(item.share) || parseInt(item.download) || parseInt(ImageDocumentAdminId)">
				    <div class="circulars">
				    	<i class="ri-more-2-fill"></i>
				    </div>
					<el-dropdown-menu slot="dropdown" style="width: 165px;">
						<el-dropdown-item v-if="parseInt(item.share)" :command="ImageOperationVal('share',item.rid)">
							<i class="ri-share-line" style="vertical-align: bottom;font-size: 16px;"></i>
							分享
						</el-dropdown-item>
						<el-dropdown-item v-if="parseInt(item.download)" :command="ImageOperationVal('down',item.dpath)" class="circulars">
							<i class="ri-download-2-line" style="vertical-align: bottom;font-size: 16px;"></i>
							下载
						</el-dropdown-item>
						<el-dropdown-item v-if="parseInt(ImageDocumentAdminId)" :command="ImageOperationVal('address',item.rid)" class="circulars">
							<i class="ri-map-pin-2-line" style="vertical-align: bottom;font-size: 16px;"></i>
							固定地址
						</el-dropdown-item>
					</el-dropdown-menu>
				</el-dropdown>
			</div>
			<div 
				class="image-single radius" 
				:class="[{'border':item.opentype=='video'||item.opentype=='audio'},ImageType]"
				:style="{height: item.pheight+'px',width: (item.pwidth-8)+'px',background:'#'+item.color}"
				@mouseenter="ImageMouseenter" 
				@mouseleave="ImageMouseleave" 
				@click="item.type!='audio'&&!ImageDocumentCtrl&&ImageDetails(item.rid)">
				<div class="image-storage">
					<!-- <img class="img thumbnail" :src="item.icondata" alt=""> -->
					<img class="img opacity" :src="item.icondata" alt="" @load="Imageload(item.rid)"  :ref="'img_'+item.rid" />
				</div>
				
				<template v-if="item.type=='audio'">
					<div v-if="!ImageDocumentCtrl" @click.stop="ImageDetails(item.rid)" class="circulars link">
						<i class="ri-search-line"></i>
						<span class="el-link--inner">详情</span>
					</div>
				</template>
				<template v-else>
					<div v-if="item.link&&!ImageDocumentCtrl" @click.stop="ImageLink(item.link)" class="circulars link">
						<i class="ri-link"></i>
						<span class="el-link--inner">链接</span>
					</div>
				</template>
				<div v-if="!ImageDocumentCtrl && (item.type=='audio'||item.type=='video')" class="image-playurl" data-status="true" :data-type="item.type" :data-playurl="item.mediaplayerpath" :class="{exhibit:!parseInt(item.share)&&!parseInt(item.download)&&!parseInt(ImageDocumentAdminId)}">
					
				</div>
				
			</div>
			<div class="message">
				<div class="name" v-if="HeaderRightBtnDisplay.value.indexOf('name')>-1 || HeaderRightBtnDisplay.value.indexOf('extension')>-1">
				<template v-if="HeaderRightBtnDisplay.value.indexOf('name')>-1">{{item.name}}</template><template v-if="HeaderRightBtnDisplay.value.indexOf('extension')>-1">.{{item.ext}}</template>
				</div>
				<template v-if="HeaderRightBtnDisplay.value.indexOf('other')>-1">
					<div class="other" v-if="HeaderRightBtnDisplay.other=='size'">
						<template  v-if="parseInt(item.width)>0">
							<span>{{item.width}} × {{item.height}}</span>
						</template>
						<template v-else>•</template>
					</div>
					<div class="other" v-else-if="HeaderRightBtnDisplay.other=='filesize'">
						<span>{{item.fsize}}</span>
					</div>
					<div class="other" v-else-if="HeaderRightBtnDisplay.other=='tag'">
						<span v-if="!item.tags" class="label">-</span>
						<span v-else class="label" v-for="tg in item.tags">•{{tg}}</span>
					</div>
					<div class="other" v-else-if="HeaderRightBtnDisplay.other=='grade'">
						<span v-for="item in parseInt(item.grade)" class="score active el-icon-star-on"></span><span v-for="item in 5-parseInt(item.grade)" class="score el-icon-star-on"></span>
					</div>
					<div class="other" v-else-if="HeaderRightBtnDisplay.other=='btime'">
						<span>{{item.btime}}</span>
					</div>
					<div class="other" v-else-if="HeaderRightBtnDisplay.other=='dateline'">
						<span>{{item.dateline}}</span>
					</div>
					<div class="other" v-else-if="HeaderRightBtnDisplay.other=='mtime'">
						<span>{{item.mtime}}</span>
					</div>
				</template>
			</div>
		</div>
	</div>
</template>